/*
 * Created: 2022-08-25 08:20:18
 * Author : 涛涛涛
 */
//! 如果要使用一些class的生命周期,直接使用高阶组件来完成
// 导出配置,写在此处,其实嘛也没有
definePageConfig({});
import React, { useEffect } from 'react';
import { View, Image } from '@tarojs/components';
import { styled } from 'linaria/react';
import { useClassName } from '@/utils/index';
import { HomeContext, useHomeExhibitionList } from './HomeContext';
import RootPageComponent from '@/pages/components/RootPageComponent/RootPageComponent';
import FixedBanner from './FixedBanner/FixedBanner';
import ProductList from './ProductList/ProductList';
import HeadNavRightButtons from './HeadNavRightButtons/HeadNavRightButtons';
export interface IProps extends ICompProps {}
Home.defaultProps = {} as Partial<IProps>;
function Home(props: IProps) {
    const { className } = props;
    const localClassName = useClassName('Home', className);
    const { homeExhibitionState } = useHomeExhibitionList();
    return (
        <HomeContext.Provider value={{ homeExhibitionState }}>
            <RootView className={localClassName}>
                <View className="Home-inner">
                    <RootPageComponent enableExpand={true} headNavContentRightSlot={<HeadNavRightButtons />} leftTitle="极影数藏">
                        <FixedBanner></FixedBanner>
                        <ProductList></ProductList>
                    </RootPageComponent>
                </View>
            </RootView>
        </HomeContext.Provider>
    );
}
export default React.memo(Home);
const RootView = styled(View)`
    position: relative;
    .Home-bg {
        position: absolute;
        display: block;
        width: 100%;
        height: 100%;
    }
    .Home-inner {
        /* backdrop-filter: saturate(100%) blur(200px); */
        background-image: linear-gradient(163deg, #eaf1f7 0%, #f9f2fb 69%, rgba(255, 242, 252, 0) 100%);
    }
`;
